@baseColor:#2B2B2B;
@grayColor:rgb(113,113,113,113);
/*头部*/
.headerwrap{
	>header{
		>.header{
			>.top{
				width: 100%;
				height: 38px;
				line-height: 38px;
				font-size: 12px;
				background-color:@baseColor;
				 color:#fff;
				 font-weight: bold;
				>.wp{
					position:relative;
					>.personal{
						height: 34px;
						>.user{
							width: 100px;
							height: 30px;
							>dd{
								line-height: 40px;
								cursor: pointer;
								float: right;
								margin-right: 25px;
								img{
									position:absolute;
									top: 3px;
									right: 5px;
								}
							}
							>dt{
								cursor: pointer;
								margin-top: 5px;
								margin-right: 20px;
								line-height: 28px;
								img{
									height: 20px;
									width: 20px;
									border-radius: 10px;
								}
							}
						}
						>.userdetail{
							position: absolute;
							display: block;
							top: 39px;
							right: 0;
							border:1px solid rgb(204,204,204);
							width: 300px;
							border-radius:10px;
							>dl{
								position: relative;
								height: 100px;
								>dt{
									position: absolute;
									top: 15px;
									left: 30px;
									>img{
										width: 80px;
										height: 80px;
										border-radius:40px;
									}
								}
								>dd{
									text-align: right;
									position: absolute;
									top: 10px;
									right: 30px;
									color:#000;
								}
							}
							>.btn{
								height: 30px;
								width: 100%;
								margin-bottom: 20px;
								float:left;
								>.personcenter{
									background-color:@grayColor;
									display: block;
									text-align: center;
									height: 30px;
									line-height: 30px;
									width: 65%;
									color:#fff;
									border-radius:10px;
									&:hover{
										text-decoration:none;
									}
								}
								>.fr{
									display: block;
									height: 30px;
									width: 32%;
									text-align:center;
									background-color:@grayColor;
									color:#fff;
									border-radius:10px;
									line-height: 30px;
									&:hover{
										text-decoration:none;
									}

								}
							}
						}
					}
					
				}
			}
			>.middle{
				clear:both;
				height: 116px;
				line-height: 12px;
				width: 100%;
				border-bottom:3px solid #F5F5F5;
				>.wp{
					background:url(../images/header_middle.png) no-repeat right 10px;
					>a{
						cursor: pointer;
						>img{
							float:left;
						}
					}
					>h1{
						border-left:1px solid rgb(255,255,255,255);
						font-weight: bold;
						font-size:30px;
						display: block;
						height: 45px;
						line-height: 45px;
						padding-left: 20px;
						margin-left: 50px;
						margin-top: 30px;
					}
				}
			}
		}
	}
}
/*页面指示条*/
.nav{
	>.wp{
		>.crumbs{
			width: 100%;
			height: 50px;
			line-height: 50px;
			color:#454545;
			letter-spacing: 2px;
			overflow: hidden;
			li{
				float:left;
				a{
					color:#454545;
					text-decoration: none;
				}
			}
		}
	}
}
/*主体信息*/
.list {
	position: relative;
	min-height: 200px;
	height: auto;
	overflow: hidden;
	clear: both;
	margin-bottom: 40px;
	margin-top: 0px;
	/*导航*/

	> .left {
		width: 210px;
		float: left;
		background-color: #f8f8f8;
		border: 1px solid #eaeaea;

		> ul {
			margin-bottom: 0;

			> .active {
				background: url(../images/icon/arrow_g.png) no-repeat 95% center;
				background-color: #fff;
				border-left: 2px solid #717171;
				color: #ed9328 !important;
			}

			> li {
				width: 100%;
				height: 60px;
				line-height: 60px;
				font-size: 16px;
				border-bottom: 1px solid #eaeaea;
				background: url(../images/icon/arrow.png) no-repeat 95% center;
				display: list-item;

				> a {
					width: 90%;
					margin: 0% 5%;
					height: 100%;
					display: block;
					color: #3a3a3a;
					text-decoration: none;

					&:hover, &:visited {
						text-decoration: none;
					}

				}

				&:hover {
					background-color: #fff;
					color: #ed9328 !important;
				}
			}
		}
	}

	/*信息*/

	> .right {
		width: 945px;
		float: right;
		overflow: hidden;
		margin-bottom: 20px;

		> .personal_des {
			> .tab-pane {
				> .head {
					border: 1px solid #eaeaea;
					background-color: #f8f8f8;
					color: #333;
					height: 50px;
					line-height: 50px;
					text-indent: 20px;
					font-size: 14px;

					> h1 {
						display: inline;
						color: #717171;
						font-size: 18px;
					}
				}

				> .inforcon {
					border: 1px solid #eaeaea;
					height: auto;
					overflow: hidden;
					width: 943px;
					border-top: 0;

					> .left {
						float: left;
						height: 100%;
						text-align: center;
						border: 0;
						background: none;

						.btn {
							width: 100px;
							background-color: #717171;
							color: #fff;
							text-align: center;
						}

						> .clearfix {
							> .changearea {
								> span {
									color: #9f9f9f;
								}

								> .pic {
									display: block;
									width: 100px;
									height: 100px;
									border-radius: 50%;
									overflow: hidden;
									border: 3px solid #eee;
									margin: 50px auto 20px;

									> .img {
										max-width: 100%;
										max-height: 100%;
									}
								}

								> .upload-inp-box {
									margin-left: 70px;
									margin: 0 65px;
									position: relative;
									overflow: hidden;

									> input[type=file] {
										position: absolute;
										right: 0;
										top: 0;
										height: 35px;
										opacity: 0;
										cursor: pointer;
									}
								}
							}
						}

						> div {
							border-top: 1px solid #eaeaea;
							margin-top: 30px;
							height: 100%;

							> a {
								margin: 80px auto;
								width: 100px;
								display: block;
								text-decoration: none;

								> div {
									padding: 0;
									height: 33px;
									line-height: 33px;

									&:hover {
										background-color: #ed9328;
									}
								}

							}
						}
					}

					> .perinform {
						> .right {
							width: 700px !important;
							height: 100%;
							border-left: 1px solid #eaeaea;
							font-size: 14px;
							margin: 0;
							float: right;
							overflow: hidden;

							> li {
								float: left;
								width: 100%;
								height: 50px;
								line-height: 50px;
								border-bottom: 1px solid #eaeaea;
								text-indent: 20px;
								color: #a9a9a9;
								position: relative;

								span {
									color: #717171;
									overflow: hidden;
									word-break: break-all;
								}

								> input[type=text] {
									color: #3d3d3d;
									height: 30px;
									line-height: 30px;
									margin-left: 20px;
									text-indent: 10px;
									width: 300px;
									background-color: #fafafa;
								}

								> i {
									color: #f00;
									display: none;
								}

								> label {
									display: inline;
									text-indent: 0;
									width: 50px;

									> input[type='radio'] {
										margin-right: 5px;
									}

								}

								.borderno {
									border: 0;
									margin-right: 10px;
									width: 252px !important;
									display: inline;
								}

								.changeemai_btn {
									text-indent: 0;
									cursor: pointer;

									> a {
										color: #a9a9a9;
										text-decoration: none;

										> div {
											height: 30px;
											line-height: 30px;
											display: inline-block;
										}
									}
								}
							}

							> .heibtn {
								text-align: center;
								height: 150px !important;
								padding-top: 50px;

								> a {
									display: inline-block;
									height: 35px;
									width: 100px;
								}

								.btn {
									text-indent: 0;
									padding: 0;
									background-color: #717171;
									color: #fff;
									border-radius: 2px;
									height: 35px;
									width: 100px;
									line-height: 35px;
									display: block;
									margin: auto;
									text-align: center;
								}
							}
						}
					}
				}
			}
			> #my_favorite, #my_recommend, #my_browsingHistory {
				> .body {
					overflow: hidden;
					width: 100%;
					padding: 5px 10px;
					> .movie {
						float:left;
						padding: 25px 35px;
						margin-bottom: 20px;
						height: 275px;
						width: 25%;
						float: left;
						> a {
							display: inline-block;
							width: 100%;
							height: 100%;
							> img {
								height: 100%;
								border: 1px solid #000;
								width: 100%;
							}
							> span {
								height:10%;
								display: block;
								padding-top: 5px;
								display: block;
								text-align: center;
								font-size:14px;
							}
						}
					}
				}
			}
		}
	}
}
/*模态窗体*/
.modal-dialog{
	padding:15px;
	position:fixed;
	color:#7c7c7c;
	overflow: auto;
	z-index: 999;
	top:30%;
	left:36%;
	>.modal-content{
		width:400px;
		>.tab-pane{
			width:100%;
			position: relative;
			>.modal-header{
				span{
					display: block;
					position: absolute;
					top:5px;
					right:20px;
					font-size:45px;
				}
				>.modal-title{
					font-size:20px;
				}	
			}
			>.modal-body{
				width:340px;
				margin:0 auto;
				padding:20px 0;
				>form{
					margin-top: 15px;
					>.box{
						margin-top:15px;
						width:100%;
						height:45px;
						line-height: 45px;
						margin:15px 0;
						border-radius: 3px;
						position:relative;
						border:1px solid #ccc;
						>span{
							border-right: 1px solid #ccc;
							width:80px;
							height:100%;
							margin-top:0px;
							text-align: center;
							display: inline-block;
						}
						>input{
							width:255px;
							padding:5px;
							height:100%;
							line-height: 100%;
							border:0;
							position: absolute;
							right: 0;
							top:0;
							font-size:20px;
						}
						>input::-webkit-input-placeholder{
							font-size:16px;
						}
					}
				}
			}
			>.modal-footer{
				width:340px;
				margin:0 auto;
				padding:20px 0;
				padding-top:0;
				border-top:0;
				.btn{
					width:100%;
					height:45px;
					line-height: 45px;
					background-color:#5dbf45;
					margin:0;
					padding:0;
					cursor:pointer;
					border:0;
					>input{
						border:0;
						background:none;
						width:100%;
						color:#fff;
						cursor: pointer;
						line-height: 45px;
					}
				}
			}
		}
		>#changeEmail{
			.modal-body{
				>p{
					font-size:16px;
					text-align: center;
					line-height: 50%;
					color:#333;
					margin-bottom: 0;
				}
				>form{
					>.box{
						width:100%;
						>input{
							position: static;
							width:100%;
						}
						>.email_code{
							width:246px;
						}
					}
					>.box:nth-of-type(2){
						>.getcode{
							position:absolute;
							top:0;
							right:0;
							width:auto !important;
							color:#fff;
							display: block;
							height:35px !important;
							margin:5px !important;
							border:0 !important;
							text-align: center;
							cursor:pointer;
							line-height: normal !important;
							background-color:#ff7800;
							font-size:14px;
							border-radius: 3px;
						}
					}
				}
			}
		}
		>#saveInfo{
			>.modal-body{
				padding:0;
				>.successbox{
					>.cont{
						//background:url(../images/icon/check2.png) no-repeat 0 center;
						height: 199px;
						padding:0;
						display: table;
						width:100%;
						padding-left:30px;
						padding-top:30px;
						padding-right: 30px;
						>img{
							height:100px;
							width:100px;
							float:left;
						}
						>h2{
							float:right;
							margin:0;
							display: tabel-cell;
							font-size:20px;
							//padding-left:115px;
							line-height: 98px;
							vertical-align: middle;
						}
					}
				}
			}
		}
	}
}
/*解决点击模态框出现窗口抖动问题*/ 
body{ padding-right: 0 !important; }
